import React, {Component} from 'react';
import {observer, inject} from 'mobx-react';
import {withRouter} from 'react-router-dom';
import {getRouteParams} from '../../util';
import {Form, ListPage} from 'weaver-mobile-page';
import {Button,ActivityIndicator,Tools} from 'weaver-mobile';
const getLabel = Tools.getLabel;

const template = {
    default: "<div class='template-wrapper'>" +
        "	<div class='template-main-box-no-state'>" +
        "		<p class='template-row template-title'>" +
        "			<span>#{capitalidspan}</span>" +
        "		</p>" +
        "		<p class='template-row'>" +
        "			<span>" + getLabel(904,"规格型号") + "：#{capitalspec}&nbsp;&nbsp;&nbsp;&nbsp;</span>" +
        "			<span>"+getLabel(1330,"单价")+"：#{price}</span>" +
        "		</p>" +
        "		<p class='template-row'>" +
        "			<span>"+getLabel(15302,"入库数量")+"：#{innumber}</span>" +
        "		</p>" +
        "	</div>" +
        "</div>"
};

@inject('acceptanceDetailStore')
@withRouter
@observer
class Acceptance extends Component {
    componentDidMount() {
        const {acceptanceDetailStore} = this.props;
        const {id} = getRouteParams(this.props);
        if(id.split(',').length>1){
            acceptanceDetailStore.init(id,'batch');
        }else{
            acceptanceDetailStore.init(id);
        }
    }

    render() {
        const {history} = this.props;
        const {form, formChange, listPageStore, applyDetails, isLoading, isChecked} = this.props.acceptanceDetailStore;
        return (<div>
                {isLoading ?
                    (<div className='loading'><ActivityIndicator animating size='large'/></div>)
                    :
                    <div>
                        <Form store={form}
                              onChange={(touch, value) => {
                                  formChange(touch, value);
                              }}/>
                        < div className='asset-acceptance-detail-card-title'>{getLabel(389835,"入库信息")}</div>
                        <ListPage.Normal
                            rowKey='capitalid'
                            template={template}
                            store={listPageStore}
                        />
                    </div>
                }
                {isChecked ==='1'?<div></div>:<div className="cpt-button-group">
                    <Button type="ghost" className='cpt-button-cancel' onClick={() => {
                        history.go(-1)
                    }}>{getLabel(31129,"取消")}</Button>
                    <Button type="primary" className='cpt-button-apply' onClick={() => {
                        applyDetails(history);
                    }}>{getLabel(826,"确定")}</Button>
                </div>
                }
            </div>
        );
    }


}

module.exports = Acceptance;
